Exercice 1

Exercice réalisé ci-dessous :


A partir de données, stockées dans un fichier json, issues du site web https://geo.api.gouv.fr/ nous allons calculer des statistiques sur les départements du Puy de Dôme ou de l’Allier (vous pouvez également choisir le département de votre choix en utilisant les outils fournies sur le site https://geo.api.gouv.fr/ : en ligne de commande tapez cette commande pour enregistrer les données relatives au Puy de Dôme...

Cliquez ici pour voir le résultat du code PHP


Voici le code du formulaire :

    
        
            <!DOCTYPE html>
            <html lang="fr">
            <head>
                <meta charset="UTF-8">
                <title>Choisir un département</title>
                <link rel="stylesheet" type="text/css" href="style.css">
            </head>
            <body>
                <h1>Veuillez choisir un département ci-dessous :</h1>
                <form action="controller.php" method="get">
                    <label for="departement">Numéro de département :</label>
                    <input type="text" id="departement" name="departement" required>
                    <button type="submit">Afficher les communes</button>
                </form>
            </body>
            </html>

Voici le code du Model :

    
        
            <?php
            class Commune {
                public $nom;
                public $codesPostaux;
                public $codeDepartement;
                public $population;
        
                public function __construct($nom, $codesPostaux, $codeDepartement, $population) {
                    $this->nom = $nom;
                    $this->codesPostaux = $codesPostaux;
                    $this->codeDepartement = $codeDepartement;
                    $this->population = $population;
                }
            }
            ?>

Voici le code du Controller :

    
        
            <?php
            require_once("model.php");
        
            class Controller {
                public function handleRequest() {
                    if(isset($_GET[\'departement\'])) {
                        $departement = $_GET[\'departement\'];
        
                        $json = file_get_contents("https://geo.api.gouv.fr/departements/{$departement}/communes");
                        $communes = json_decode($json);
        
                        $tabCommune = [];
        
                        foreach ($communes as $commune) {
                            $tabCommune[] = new Commune($commune->nom, $commune->codesPostaux, $commune->codeDepartement, $commune->population);
                        }
        
                        include "view.php";
                    } else {
                        include "form.php";
                    }
                }
            }
        
            $controller = new Controller();
            $controller->handleRequest();
            ?>

Voici le code du View :

    
        
            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="UTF-8">
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <title>Communes</title>
                <link rel="stylesheet" href="style.css">
            </head>
            <body>
                <h1>Communes du département <?php echo $tabCommune[0]->codeDepartement; ?></h1>
                <input type="text" id="searchInput" placeholder="Rechercher une commune...">
                <div class="container2" id="communeContainer">
                    <?php foreach ($tabCommune as $commune): ?>
                        <div class="card">
                            <p><strong>Nom:</strong> <?php echo $commune->nom; ?></p>
                            <p><strong>Codes postaux:</strong> <?php echo implode(", ", $commune->codesPostaux); ?></p>
                            <p><strong>Code département:</strong> <?php echo $commune->codeDepartement; ?></p>
                            <p><strong>Population:</strong> <?php echo $commune->population; ?></p>
                        </div>
                    <?php endforeach; ?>
                </div>
            
                <script>
                    <?php echo htmlspecialchars('
                    const searchInput = document.getElementById(\'searchInput\');
                    const cards = document.querySelectorAll(\'.card\');
                    searchInput.addEventListener(\'input\', function(event) {
                        const searchValue = event.target.value.toLowerCase(); 
                        cards.forEach(card => {
                            const communeName = card.querySelector(\'p:first-child\').textContent.toLowerCase(); 
                            if (communeName.includes(searchValue)) {
                                card.style.display = \'block\'; 
                            } else {
                                card.style.display = \'none\'; 
                            }
                        });
                    });'); ?>
                </script>
            </body>
            </html>